<!-- 物业企服 -->
<template>
  <div class="zs-table-page-container">
    <HeaderProjectMonth :cardIndex="cardIndex" :tabType="tabType" @onChange="changeTab" @onSearch="search">
    </HeaderProjectMonth>

    <TwoControlTableBudget v-show="tabType == 1 && tableListTwoControl && benchmarkType == 0"
      :tableList="tableListTwoControl" :yearmonth="yearmonth" :isFresh="isFresh">
      <template v-slot:topContent>
        <CardList :list="cardList" :cardIndex="cardIndex" @onChange="changeCard"></CardList>
      </template>
    </TwoControlTableBudget>

    <TwoControlTableStandard v-show="tabType == 1 && tableListTwoControl && benchmarkType == 1"
      :tableList="tableListTwoControl" :yearmonth="yearmonth" :isFresh="isFresh">
      <template v-slot:topContent>
        <CardList :list="cardList" :cardIndex="cardIndex" @onChange="changeCard"></CardList>
      </template>
    </TwoControlTableStandard>

    <FinanceTable v-show="tabType == 2" :tableList="tableList" :yearmonth="yearmonth" :isFresh="isFresh">
    </FinanceTable>
  </div>
</template>
<script setup>
import HeaderProjectMonth from '@/views/SpecialReport/lightAssetPropertyEs/components/headerProjectMonth'
import CardList from '@/views/SpecialReport/lightAssetPropertyEs/components/cardList'
import TwoControlTableBudget from '@/views/SpecialReport/lightAssetExtConBudget/components/twoControlTableBudget'
import TwoControlTableStandard from '@/views/SpecialReport/lightAssetExtConBudget/components/twoControlTableStandard'
import FinanceTable from '@/views/SpecialReport/lightAssetPropertyEs/components/financeTable'
import { queryPropertyEsDetailsApi, queryPropertyEsTwoCalApi, queryPropertyEsTwoCalCardApi } from '@/api/SpecialReport/twoControl';
import { ref } from 'vue'
// tabType 右侧tab： 1 两算一控 2 财务口径
const tabType = ref(1)
const changeTab = (data) => {
  tabType.value = data.data
}

const isFresh = ref('');
const projectCode = ref('');
const yearmonth = ref('');
const benchmarkType = ref('')
const cardList = ref([])
const cardIndex = ref(0) // 卡片选中的index + 导出接口 + 表格接口
const tableListTwoControl = ref([])
const tableList = ref([])

const search = async (data) => {
  cardIndex.value = 0
  projectCode.value = data.projectCode
  yearmonth.value = data.yearmonth
  benchmarkType.value = data.benchmarkType

  const tipLeft = data.benchmarkType == 0 ? '累计预算' : data.benchmarkType == 1 ? '累计标准' : ''

  await queryPropertyEsTwoCalCardApi(data).then(res => {
    if (res.data.code == 200) {
      cardList.value = []
      res.data.data.map(item => {
        cardList.value.push(
          { titleLeft: item.projectProduct, titleRight: '净利润率', tipLeft: tipLeft, tipRight: '累计实际', numLeft: item.accBudgetPc, numLeftUnit: '%', numLeftColor: '0', numCenter: 'vs', numRight: item.accRateProportion, numRightUnit: '%', numRightColor: item.accPjRed, }
        )
      })
    }
  })

  await twoControlTable()

  await queryPropertyEsDetailsApi({ projectCode: data.projectCode, yearmonth: data.yearmonth }).then(res => {
    if (res.data.code == 200) {
      tableList.value = res.data.data
    }
  })

  isFresh.value = new Date().getTime();
}

const twoControlTable = async () => {
  await queryPropertyEsTwoCalApi({ projectCode: projectCode.value, yearmonth: yearmonth.value, benchmarkType: benchmarkType.value, productType: cardIndex.value }).then(res => {
    if (res.data.code == 200) {
      tableListTwoControl.value = res.data.data
    }
  })
}

const changeCard = async (data) => {
  cardIndex.value = data.data
  await twoControlTable()
  isFresh.value = new Date().getTime();
}
</script>

<style scoped lang="scss"></style>
